
<?php if((@$page_name=='Profile') || (@$page_name=='Feeds') || (@$page_name=='Search') || (@$page_name=='Messages') || (@$page_name=='Reviews') || (@$page_name=='Forum') || (@$page_name=='View') || (@$page_name=='Ranking') || (@$page_name=='FullStory')|| (@$page_name=='Group' ) || (@$page_name=='MyGroup' ) || (@$page_name=='About' ) || (@$page_name=='Events' ) || (@$page_name=='Job' ) || (@$page_name=='Faqs' ) || (@$page_name=='ForumView' ) || (@$page_name=='Mythreads' ) || (@$page_name=='Event' ) || (@$page_name=='Job' ) || (@$page_name=='Faqs' ) || (@$page_name=='ForumView' ) || (@$page_name=='Subscribedthreads' ) || (@$page_name=='Unansweredthreads' ) || (@$page_name=='Jobs' ) || (@$page_name=='Dashboard' ) || (@$page_name=='GroupDash' ) || (@$page_name=='SuggestEdit' ))  { ?>
<div class="header-user-wrap row">
	<header class="header-holder medium-10 medium-centered column">
		<div class="header-left-section medium-6 column">
			<div class="logo-colored medium-1 column">
				<a href="<?= BASE_URI?>feeds"><img src="<?php echo BASE_URI; ?>img/icons/logo3.png"></a>
			</div>
			<div class="medium-11 column">
				<form>		
			      <div class="search-header row collapse">
			        <div class="small-9 columns">
			          <input id="searchboxx" type="text" placeholder="Search">
			        </div>
			        <div class="small-1 columns">
			          <a id="btnSearch" class="button postfix"><i class="fa fa-search"></i></a>
			        </div>
			        <div class="small-2 columns">
					   <!-- <dl id="searchoption" class="search-dropdown">
					        <dt><a><span style="color:white;">People <i class="fa fa-caret-down" style="color:white;"></i></span></a></dt>
					        <dd>
					            <ul>
					                <li><a selected href="#">People<span class="value"></span></a></li>
					                <li><a href="#">Company<span class="value"></span></a></li>
					                <li><a href="#">Groups<span class="value"></span></a></li>
					                <li><a href="#">Map<span class="value"></span></a></li>
					            </ul>
					        </dd>
					    </dl>
						<span id="result" style="display:none !important;"></span>-->
			        </div>
			      </div>
				</form>
			</div>			
		</div>
		<div class="header-right-section medium-6 column">
			<ul class="right inline-list"><!---->
				<li><a class="excep" data-dropdown="user-account" aria-controls="user-account" aria-expanded="false">
				<img alt="dp" src="<?= IMAGE_URL_SMALL.$this->session->get('profile_pic')?>">&nbsp;&nbsp;<?= $this->session->get('fullname') ?></a>
					<ul id="user-account" class="f-dropdown" data-dropdown-content aria-hidden="true" tabindex="-1">
					  <li><a style="color:gray;">Account Settings</a></li>
					  <li><a class = "btnLogout" style="color:gray;">Logout</a></li>
					</ul>
				</li>
				<li id="friendreq_li">
					<?php $this->view->partial('common/friend_request'); ?>
				</li>
				<li id="message_li">
					<?php $this->view->partial('common/messages'); ?>
				</li>
				<li id="notification_li">
					<?php $this->view->partial('common/notification'); ?>
				</li>
				<li><a><img src="<?=BASE_URI?>img/icons/FinalNavSettingsIcon.png"></a></li>						
			</ul>			
		</div>
	</header>
</div>

<script type="text/javascript" src="<?= BASE_URI ?>js/header_user.js"></script>
<script type="text/javascript">
	     $(document).ready(function() {
        	var category;
        	function initSearchPeople(){
		    	$('#searchboxx').attr("placeholder", "Search for People, Company ,Group or City");
		        category = "People";
						    $.ajax({
						    	async: true,
						    	url: URL + 'search/listpeople',
						    	dataType: 'json',
						    	success: function(result){
						    		console.log(result);
						    		$( "#searchboxx" ).autocomplete({
						    		  minLength: 0,
								      source: result.data,
								      select: function(event,ui){
								      		$('#searchboxx').val(ui.item.label);
								      		window.location.replace(ui.item.href);
								      		//$('#btnSearch').click();
								      }
								    }).autocomplete("instance")._renderItem = function(ul,item){
								    	$(ul).addClass('searchWrapUl');
						    			 return $("<li/>")
								            .append("<a class='searchx searchResult'><img src='" + item.icon + "' />" + item.label + "<p class='search_desc'>" + item.desc + "</p>" + "</a>")
								            .appendTo(ul);
								    };  		
						    	}
						    });
		    }

		    function initSearchCities(){
		    	$('#searchboxx').attr("placeholder", "Type Address");  
                	$('#searchboxx').val('');	
                	
				    $.ajax({
				    	url: URL + 'search/listcities',
				    	dataType: 'json',
				    	success: function(result){
				    		$( "#searchboxx" ).autocomplete({
						      source: result.data
						    }).autocomplete("instance")._renderItem = function(ul,item){
								    	$(ul).addClass('searchWrapUl')
						    			 return $("<li />")
								            .append("<a class='searchResult'>"+ item.label + "</a>")
								            .appendTo(ul);
								    };       		
				    	}
				    });
		    }
		    function initSearchCompany(){
		    	$('#searchboxx').attr("placeholder", "Search for Company");
                $('#searchboxx').val('');	
                category = "Company";
                
						    $.ajax({
						    	url: URL + 'search/listcompany',
						    	dataType: 'json',
						    	success: function(result){
						    		console.log(result);
						    		$( "#searchboxx" ).autocomplete({
						    		  minLength: 0,
								      source: result.data,
								      select: function(event,ui){
								      		$('#searchboxx').val(ui.item.label);
								      		$('#btnSearch').click();
								      }
								    }).autocomplete("instance")._renderItem = function(ul,item){
								    	$(ul).addClass('searchWrapUl')
						    			 return $("<li />")
								            .append("<a class='searchResult'><img src='" + item.icon + "' />" + item.label + "</a>")
								            .appendTo(ul);
								    };  		
						    	}
						    });
		    }
		    function initSearchGroup(){
		    	$('#searchboxx').attr("placeholder", "Type Group Name");
                $('#searchboxx').val('');

                category = "Group";
                
						    $.ajax({
						    	url: URL + 'search/listgroups',
						    	dataType: 'json',
						    	success: function(result){
						    		console.log(result);
						    		$( "#searchboxx" ).autocomplete({
						    		  minLength: 0,
								      source: result.data,
								      select: function(event,ui){
								      		$('#searchboxx').val(ui.item.label);
								      		$('#btnSearch').click();
								      }
								    }).autocomplete("instance")._renderItem = function(ul,item){
								    	$(ul).addClass('searchWrapUl')
						    			 return $("<li />")
								            .append("<a class='searchResult'><img style='height:100px' src='" + item.icon + "' />" + item.label + "</a>")
								            .appendTo(ul);
								    };  		
						    	}
						    });	
		    }
        	initSearchPeople();
        	$('#searchboxx').keypress(function (e) {
			 var key = e.which;
			 if(key == 13)  // the enter key code
			  {
			    $('#btnSearch').click();
			    return false;  
			  }
			}); 
        	$('#btnSearch').click(function(){
        		var searchString  = $('#searchboxx').val();
        		window.location.replace(URL + 'search?searchBy='+ category + '&searchString=' + searchString);
        	});

            $(".search-dropdown img.flag").addClass("flagvisibility");

            $(".search-dropdown dt a").click(function() {
                $(".search-dropdown dd ul").fadeToggle(200);
            });
                        
            $(".search-dropdown dd ul li a").click(function() {
                var text = $(this).html();
             	category = $(this).text();
             	
                if(category=='People') {
           	    	initSearchPeople();
                }
                else if(category=='Company') {
                	initSearchCompany();
                }
                else if(category=='Groups') {
                	initSearchGroup();
                }
                else  {
                	initSearchCities();
                }
                $(".search-dropdown dt a span").html(text);
                $(".search-dropdown dd ul").hide();
                $("#result").html("Selected value is: " + getSelectedValue("searchoption"));

            });
                        
            function getSelectedValue(id) {
                return $("#" + id).find("dt a span.value").html();
            }

            $(document).bind('click', function(e) {
                var $clicked = $(e.target);
                if (! $clicked.parents().hasClass("search-dropdown"))
                    $(".search-dropdown dd ul").hide();
            });


            $("#flagSwitcher").click(function() {
                $(".search-dropdown img.flag").toggleClass("flagvisibility");
            });
        });

function listNotif(){
	return $.ajax({
		url: URL + 'notifications/list',
		dataType: 'json'
	});
}	

function loadNotif(){
		listNotif().done(function(result){
				var content = '';
		
				$(result).each(function(i,val){
						if(typeof(val.data) == "string"){
						val.data = JSON.parse(val.data);
						}
						val.data.notif_id = val.notif_id;
						
						if(val.has_read == 0){
							val.data.hasnt_read = true;
						}
						switch(val.type)
						{
							case "accept_request":
								var template = $('#notifAcceptRequest').html();
								var html = Mustache.to_html(template,val.data);
								content += html;
							break;
							case "wall_post":
								var template = $('#notifWallPost').html();
								var html = Mustache.to_html(template,val.data);
								content += html;
							break;
							case "comment":
								console.log(val.data);
								var template = $('#notifComment').html();
								var html = Mustache.to_html(template,val.data);
								content += html;
							break;
							case "accept_group_request":
								console.log(val.data);
								var template = $('#notifGroupAcceptRequest').html();
								var html = Mustache.to_html(template,val.data);
								content += html;
							break;
						}
				});

				if(content != ''){
					$('#notificationContainer').children('#bodyNotif').html(content);
				}else{
					$('#notificationContainer').children('#bodyNotif').html('<center>No Notification </center>');
				}
		}); // end of listNotif
} // end of loadNotif


function markAsRead(notif_id){
	return $.ajax({
		url: URL + 'notifications/mark',
		data: {notif_id: notif_id},
		type: 'post'
	});
}

function countUnread()
{
	$.ajax({
		url: URL + 'notifications/countunread',
		type: 'post',
		dataType: 'json',
		success:function(result){
			if(result.friend == 0){
				$('#counterrequestfriend').text(0).hide();
			}else{
				$('#counterrequestfriend').text(result.friendrequestContainer).hide();
			}

			if(result.notification == 0){
				$('#counterNotif').text(0).hide();
			}else{
				$('#counterNotif').text(result.notification).show();
			}
		}

	});

}
function showNotif()
{
	var total = $('#notificationContainer').children('#bodyNotif').children('.active-notif').length;
	if(total > 0){
		$('#counterNotif').text(total).show();
	}else{
		$('#counterNotif').text(total).hide();
	}
}
$(document).ready(function(){	
	countUnread(); // count unread notif
	$("#linkNotif").click(function(){
		$("#friendrequestContainer").hide();
		$("#messageContainer").hide();
		$("#notificationContainer").fadeToggle(300,function(){
			loadNotif();
			showNotif();	
		});
		$("#counterNotif").fadeOut("slow");
	 
		return false; 
	});

	$('#notificationContainer').on('click','.notif_redirect',function(){
		var redirect = $(this).attr('data-url');
		var notif_id = 	$(this).attr('data-id');
	
		markAsRead(notif_id).done(function(result){
		});

		$(this).removeClass('active-notif');
		window.open(redirect,'_blank');
	});	

	//Document Click
	$(document).click(function(){
		$("#notificationContainer").hide();
		$("#messageContainer").hide();
		$("#friendrequestContainer").hide();
	});

	//Popup Click
	$("#notificationContainer").click(function()
	{
		return false;
	});

	$("#messageContainer").click(function(){
		return false;
	});

	
	$("#friendrequestContainer").click(function(){
		return false
	});

	$("#requestsNotif").click(function(){
		$("#messageContainer").hide();
		$("#notificationContainer").hide();
		$("#friendrequestContainer").fadeToggle(300);
		$("#counterrequestfriend").fadeOut("slow");
		return false; 
	});

	$("#messagenotif").click(function(){
		$("#notificationContainer").hide();
		$("#friendrequestContainer").hide();
		$("#messageContainer").fadeToggle(300);
		$("#countermessages").fadeOut("slow");
		return false; 
	});

});


$(document).ready(function() {
  $("#reqs").click(function(event){
      $('#view-stage').load('view/requests');
  });
  $("#msgs").click(function(event){
      $('#view-stage').load('view/message');
  });
  $("#noti_seall").click(function(event){
		window.location.href = "view";
  });
  $("#sett").click(function(event){
      $('#view-stage').load('view/settings');
  });
});
</script>


<?php } elseif ((@$page_name=='Step_1') || (@$page_name=='Step_2') ||(@$page_name=='Step_3') || (@$page_name=='Step_4')) { ?>
<div class="row">
	<div class="step-wrapper large-10 large-centered column">
		<img class="logo2" src="<?php echo BASE_URI; ?>img/icons/logo2.png">
 	</div>
</div>
 <?php } ?>
 

